<!--<ImgUpLoad v-if="open" @subMitList="springList" :backList="form.springImagesList || []"></ImgUpLoad>-->
<template>
<div class="imgUp-container d-c">
  <el-upload
    :action="api + upLoadapi"
    list-type="picture-card"
    :limit="3"
    :on-preview="handlePictureCardPreview"
    :on-success="handlcheck"
    :on-exceed="handleTip"
    :file-list="imageList"
    :on-remove="handleRemove">
    <i class="el-icon-plus"></i>
  </el-upload>
  <el-dialog :visible.sync="dialogVisible">
    <img width="100%" :src="dialogImageUrl" alt="">
  </el-dialog>
</div>
</template>

<script>
export default {
  name: "ImgUpLoad",
  props: {
    backList: {
      default: []
    }
  },
  data() {
    return {
      api: process.env.VUE_APP_BASE_API ,
      upLoadapi: process.env.VUE_APP_UPLOAD_API,
      dialogImageUrl: '',
      dialogVisible: false,
      imageList: []
    }
  },
  mounted() {
    this.imageList = []
    this.getOldList()
  },
  methods: {
    getOldList() {
      this.imageList = []
      if(this.backList.length > 0)
        this.backList.forEach((item,index) => {
          this.imageList.push({
            name: 'imgs'+ index,
            url: this.api + item
          })
        })
    },
    handleRemove(file, fileList) {
      console.log(file, fileList);
      let list = []
      fileList.forEach(item => {
        list.push(item.url.slice(14))
      })
      this.$emit('subMitList',JSON.stringify(list))
    },
    handlePictureCardPreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;
    },
    handlcheck(response, file, fileList) {
      console.log(file,fileList)
      let list = []
      fileList.forEach(item => {
        console.log('item1',item)
        if(!!!item.response) {
          list.push( item.url.slice(14) )
        } else {
          list.push( item.response.data.urlPath )
        }
      })
      console.log(list)
      this.$emit('subMitList',JSON.stringify(list))
    },
    handleTip(file,fileList) {
      this.$modal.msgError("最多传3张图");
    }
  }
}
</script>

<style scoped>

</style>
